<template>
  <div class="dashboard">
    <!-- 顶部筛选器 -->
    <FilterBar />

    <!-- KPI 卡片区 -->
    <KpiCards />

    <!-- 趋势图表区：将“型号时间趋势（月/周）”放到原热力图位置 -->
    <TrendCharts>
      <template #bottom>
        <el-row :gutter="20" style="margin-top: 20px;">
          <el-col :span="24">
            <ModelTimeTrend />
          </el-col>
        </el-row>
      </template>
    </TrendCharts>

    <!-- 分类与效率 -->
    <CategoryCharts />

    <!-- 型号问题统计 -->
    <ModelProblemStats />
  </div>
</template>

<script setup>
import FilterBar from '../components/FilterBar.vue'
import KpiCards from '../components/KpiCards.vue'
import TrendCharts from '../components/TrendCharts.vue'
import CategoryCharts from '../components/CategoryCharts.vue'
import ModelProblemStats from '../components/ModelProblemStats.vue'
import InitialScreeningEfficiency from '../components/InitialScreeningEfficiency.vue'
import ModelTimeTrend from '../components/ModelTimeTrend2.vue'
</script>

<style scoped>
.dashboard {
  padding: 20px;
  background-color: #f5f7fa;
  min-height: 100vh;
}

.dashboard > * {
  margin-bottom: 20px;
}
</style>
